<extend name="Base/common_nojhd"/>
<block name="TITLE"><title>我的购物车</title></block>
<block name="body">
    <if condition="$buynow eq 1">
            <form class="am-form" id='buynowcartform' action="{:U('BuyNow/createOrder')}" method="post">
        <else/>
             <form class="am-form" id='cartform' action="{:U('Cart/createOrder')}" method="post">
    </if>
    <div class="am-list-news-bd">
        <ul class="am-list">
            <if condition='$proCount gt 0'>
                <volist name='cartPros' id='vo'>
                    <!--缩略图在标题左边-->
                    <li class="am-g am-list-item-desced am-list-item-thumbed am-list-item-thumb-left">
                        <div class="am-u-sm-4 am-list-thumb ">
                            <a href="{:U('Product/ProductDetails?pid='.$vo['pid'])}"><img src="{$vo.pic}?imageView2/1/w/80/h/80/q/80"/></a>
                        </div>
                        <div class=" am-u-sm-8 am-list-main am-padding-left-0">
                            <h3 class="am-list-item-hd am-margin-bottom-xs">
                                <a href="{:U('Product/ProductDetails?pid='.$vo['pid'])}" style="font-size: 15px;">{$vo.name}
                                    <if condition="$vo.limit_num gt 0">
                                        <div class="am-margin-0 am-badge am-badge-danger am-radius" style="padding: 3px;">
                                            <span style="font-size:8px;font-weight:300">每人每天限购{$goods.limit_num}份</span>
                                        </div>
                                    </if>
                                </a>
                                <span class="am-badge am-badge-secondary">{$vo.quantity} &nbsp;<span>单价:￥{$vo.price}</span></span>
                                <a href="javascript:void(0)" dataid='{$vo.pid}' onclick="delPro(this);" ><i class="am-icon-close"></i></a>
                            </h3>
                            <div class="am-g am-list-item-text" style="min-height: none;">
                                <div class="am-input-group am-u-sm-7 ">
                                    <input type="tel" dataid="{$vo.pid}" id='pnum' name='pnum' onchange="changenum(this);" class="am-form-field" value="{$vo.pnum}">
                                    <span class="am-input-group-label am-text-danger" style="font-weight: bold">￥{$vo.price}</span>
                                </div>
                                <div class="am-u-sm-4 am-margin-0 am-padding-horizontal-0"  style="font-size: xx-small;left: -10px">
                                    <div style="color: #666;font-weight: bold">{$vo.num0}{$vo.price0}</div>
                                    <div style="color: #666;font-weight: bold">{$vo.num1}{$vo.price1}</div>
                                    <div style="color: #666;font-weight: bold">{$vo.num2}{$vo.price2}</div>
                                </div>
                            </div>
                        </div>
                    </li>
                </volist>
                <else />
                <div class="am-panel am-panel-default">
                    <div class="am-panel-bd" style=" text-align: center;">你还没有选择中意的商品哦</div>
                </div>
            </if>
        </ul>
    </div>
    <div data-am-widget="tabs" class="am-tabs am-tabs-default">
        <ul class="am-tabs-nav am-cf">
            <li class="am-active">
                <a href="[data-tab-panel-0]">收货地址</a>
            </li>
            <li class="">
                <a href="[data-tab-panel-1]">备注</a>
            </li>

        </ul>
        <div class="am-tabs-bd">
            <div data-tab-panel-0 class="am-tab-panel am-active" id="divaddresslist">
                <volist name='cartAddresses' id='vo'>
                    <label class="am-radio">
                        <blockquote>
                            <p><input type="radio" name="addressradio" id='addressradio' value="{$vo.id}" class="am-input-lg" data-am-ucheck>
                                <a data-id="{$vo.id}" data-name="{$vo.name}" data-phone="{$vo.phone}" data-shopname="{$vo.shopname}" data-city="{$vo.city}" data-street="{$vo.street}" class="addr">[{$vo.shopname}]{$vo.city}{$vo.street}</a>
                                <i class="am-icon-close"></i></p>
                            <small>{$vo.name} {$vo.phone}</small>
                        </blockquote>
                    </label>
                </volist>
                <button type="button" class="am-btn am-btn-success" id="doc-prompt-toggle">新增地址</button>
            </div>
            <div data-tab-panel-1 class="am-tab-panel">
                <div class="am-form-group">
                    <label for="doc-ta-1">输入订单备注</label>
                    <textarea class="" name='remark' rows="5" id="doc-ta-1"></textarea>
                </div>
            </div>
        </div>
    </div>

    <!---地址删除模态框--->
    <div class="am-modal am-modal-confirm" tabindex="-1" id="my-confirm">
        <div class="am-modal-dialog">
            <!--<div class="am-modal-hd">Amaze UI</div>-->
            <div class="am-modal-bd">
                确定要删除这条记录吗？
            </div>
            <div class="am-modal-footer">
                <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                <span class="am-modal-btn suredel" data-am-modal-confirm>确定</span>
            </div>
        </div>
    </div>
    <!------>

    <!--地址新增模态框-->
    <div class="am-modal am-modal-prompt" tabindex="-1" id="my-prompt">
        <div class="am-modal-dialog">
            <div class="am-modal-hd">新建收货地址</div>
            <div class="am-modal-bd">
                <input type="hidden" id="hidden_id">
                <input type="text" class="am-modal-prompt-input" id="shopName" name='shopName' placeholder="公司/店铺名称">
                <input type="text" class="am-modal-prompt-input" id="realName" name='realName' placeholder="请输入联系人姓名">
                <input type="text" class="am-modal-prompt-input" id="phone"  name='phone' placeholder="联系人电话">
                <select id="province"  name='province' class="am-modal-prompt-input">
                    <option value="江苏省">江苏省</option>
                </select>
                <select id="city"  name='city' class="am-modal-prompt-input">
                    <option value="扬州市">扬州市</option>
                    <option value="泰州市">泰州市</option>
                    <option value="江都市">江都市</option>
                    <option value="仪征市">仪征市</option>
                    <option value="高邮市">高邮市</option>
                    <option value="宝应市">宝应市</option>
                    <option value="镇江市">镇江市</option>
                </select>
                <textarea class="am-modal-prompt-input" rows="5" id="street" name='street' placeholder="详细地址"></textarea>
            </div>
            <div class="am-modal-footer">
                <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                <span class="am-modal-btn" id="addr_btn" data-am-modal-confirm>提交</span>
            </div>
        </div>
    </div>


    <div class="am-margin-xs am-text-right"><span class="am-text-danger">合计：￥</span><span class="am-text-danger" id="sumPrice">{$requriePrice}</span></div>
    <div class="am-text-right">
        <if condition='!(($proCount gt 0)and($requriePrice egt 200))'>
            <span class="am-text-danger am-text-sm">订单满200起送！</span>
        </if>
    </div>
    <div data-am-widget="navbar" class="am-navbar am-cf am-navbar-default" style="line-height:0;" id="">
            <ul class="am-navbar-nav am-cf am-avg-sm-4 am-padding-0">
                <li class="am-padding-top-xs">
                <a href="###" class="">
                    <div class="am-text-lg" id="orderPrice" data-orderamount="{$orderPrice}">应付:￥<span id="requireprice">{$orderPrice}</span></div>
                    <div class="" style="font-size: 10px;">(已余额支付￥<span class="useamount">0</span>)</div>
                </a>
                </li>
                <li style="padding-top: 2px;">
                    <button type="button" style="" class="am-btn am-btn-warning am-btn-xl" data-am-modal="{target: '#amount-modal', closeViaDimmer: 0}">余额支付</button>
                </li>
                <li class="am-text-right" style="padding-top:2px; ">
                <!----购物金额的限制$requriePrice egt 200--->
                <if condition='(($proCount gt 0)and($requriePrice egt 200))or($special eq 1)'>
                    <a href="###" >
                        <if condition="($buynow eq 1)">
                            <button type="button" onclick="buyNow();" class="am-btn am-btn-danger am-btn-xl">确定下单</button>
                            <else/>
                            <button type="button" onclick="createOrder();" class="am-btn am-btn-danger am-btn-xl">确定下单</button>
                            <!--<button type="submit"  class="am-btn am-btn-danger am-btn-xl">确定下单</button>-->
                         </if>
                    </a>
                    <else/>
                    <button type="button" class="am-btn am-btn-danger am-btn-xl am-disabled">确定下单</button>
                </if>
                </li>
            </ul>
        </div>

        <div class="am-modal am-modal-prompt" tabindex="-1" id="amount-modal">
            <div class="am-modal-dialog">
                <div class="am-modal-hd " >余额支付</div>
                <div class="am-modal-bd am-text-left " >
                    <p class="am-margin-left">可用余额:￥<span class="am-text-danger" id="buyeramount" data-buyeramount="{$buyers.amount}">{$buyers.amount}</span></p>
                    <p>
                        <input type="number" name="amount"  class="am-margin-left am-inline"  min="0" id="amountinput" max="{$buyers.amount}"  style="width: 50% !important;padding: 2px;"  placeholder="输入金额">
                        <span class=" am-btn am-btn-xs am-btn-primary am-margin-left" id="maxamount">最大使用</span>
                    </p>
                </div>
                <div class="am-modal-footer">
                    <span class="amount-btn-cancel am-modal-btn ">取消</span>
                    <span class="am-modal-btn amount-btn-confirm">确定</span>
                </div>
            </div>
        </div>
    </form>


</block>


<block name="script">
    <script>
        var amountModal=$("#amount-modal");//应付
        var orderamount=parseInt($("#orderPrice").data("orderamount"));
        var buyeramount=parseInt($("#buyeramount").data("buyeramount"));
        var amountinput=$("#amountinput");
        var useamount=$(".useamount");
        var sumPrice=parseInt($("#sumPrice").text());
        var addressModal = $("#my-prompt");
        //验证提交订单
        function createOrder() {
            if(parseInt(useamount.text())>0){
                $(".amount-btn-confirm").click();
            }
            var url = '{:U('Cart/checkStore')}';
            var params = "";
            $.ajax({
                method: 'post',
                url: url,
                params:params,
                success: function (json) {
                    if (json =="") {
                        url = "{:U('Cart/checkAmount')}";
                        params ="amount="+buyeramount;
                        $.ajax({
                            method: 'post',
                            url: url,
                            data: params,
                            success: function (json) {
                                if (json ==0) {
                                    $("#cartform").submit();
                                }else{
                                    alert("您的余额有变动！");
                                    window.location.reload();
                                }

                            }
                        })
                    } else {
                        alert(json);
                        window.location.reload();
                    }
                },
                error:function(err){
                }
            })
        }
        function buyNow() {
            if(parseInt(useamount.text())>0){
                $(".amount-btn-confirm").click();
            }
            var url = "{:U('BuyNow/checkStore')}";
            var params = "";
            $.ajax({
                method: 'post',
                url: url,
                params:params,
                success: function (json) {
                    if (json =="") {
                        url = "{:U('Cart/checkAmount')}";
                        params ="amount="+buyeramount;
                        $.ajax({
                            method: 'post',
                            url: url,
                            data: params,
                            success: function (json) {
                                if (json ==0) {
                                    $("#buynowcartform").submit();
                                }else{
                                    alert("您的余额有变动！");
                                    window.location.reload();
                                }

                            }
                        })
                    } else {
                        alert(json);
                        window.location.reload();
                    }
                }
            })
        }
        //输入余额验证
        amountinput.on("keyup",function(){
            inputAmount=parseInt(amountinput.val());

            if(inputAmount>buyeramount||inputAmount>sumPrice||inputAmount<0){
                //如果输入金额大于余额,或输入金额大于订单金额
                if(inputAmount<0||isNaN(inputAmount)){
                    amountinput.val(0);
                }else if(buyeramount>=sumPrice){
                    amountinput.val(sumPrice);
                }else{
                    amountinput.val(buyeramount);
                }
            }else{
                if(inputAmount>0){
                    amountinput.val(inputAmount);
                }else{
                    amountinput.val(0);
                }
            }
        })
        $(".amount-btn-cancel").on("click",function(){
        });
        //余额验证
        $(".amount-btn-confirm").on("click",function(){
             url = "{:U('Cart/checkAmount')}";
             params ="amount="+buyeramount;
            $.ajax({
                method: 'post',
                url: url,
                data: params,
                success: function (json) {
                    if (json ==0) {
                    }else{
                        alert("您的余额有变动！");
                        window.location.reload();
                        return false;
                    }
                }
            })
            if(amountinput.val()==""||amountinput.val()==undefined){
                $("#amountinput").val(0)
                useamount.text("0");
            }else{
                useamount.text($("#amountinput").val());
            }
            requireprice=parseInt($("#sumPrice").text())-parseInt($("#amountinput").val());
            $("#requireprice").text(requireprice);
        });
        //最大购买
        $("#maxamount").on("click",function(){
            if(orderamount>buyeramount){
                amountinput.val(buyeramount);
            }else{
                amountinput.val(orderamount);
            }
        })
        //提交订单
        $('#cartform').submit(function () {
            var pnums = document.getElementsByName("pnum");
            var addressradios = document.getElementsByName("addressradio");
            var flag = false;
            for (radio in addressradios) {
                if (addressradios[radio].checked) {
                    flag = true;
                    break;
                }
            }
            for ($i = 0; $i < pnums.length; $i++) {
                if (pnums[$i].value == "") {
                    alert("商品数量必须输入");
                    return false;
                }
            }
            if (!flag) {
                alert("请选择一个收货地址");
                return false;
            }
            alert("已下单");
            return true;
        });
        $('#buynowcartform').submit(function () {
            var pnums = document.getElementsByName("pnum");
            var addressradios = document.getElementsByName("addressradio");
            var flag = false;
            for (radio in addressradios) {
                if (addressradios[radio].checked) {
                    flag = true;
                    break;
                }
            }
            for ($i = 0; $i < pnums.length; $i++) {
                if (pnums[$i].value == "") {
                    alert("商品数量必须输入");
                    return false;
                }
            }
            if (!flag) {
                alert("请选择一个收货地址");
                return false;
            }
            alert("已下单");
            return true;
        });
        $(function () {
            $('#divaddresslist').find('.am-icon-close').add('#doc-confirm-toggle').
                    on('click', function () {
                        $('#my-confirm').modal({
                            relatedTarget: this,
                            onConfirm: function (options) {
                                var $link = $(this.relatedTarget).prev('a');
                                var addrid = $link.data('id');
                                var url = "{:U('Cart/delAddr')}";
                                var params = 'addrid=' + addrid;
                                $.ajax({
                                    method: 'post',
                                    url: url,
                                    data: params,
                                    success: function (json) {
                                        window.location.reload();
                                    }
                                })
                            },
                            // closeOnConfirm: false,
                            onCancel: function () {
                            }
                        });
                    });
        });
        $(function () {
            $('#doc-prompt-toggle').on('click', function () {
                var hiddenid = $("#hidden_id");
                $('#my-prompt').modal({
                    relatedTarget: this,
                    onConfirm: function (e) {
                        var flag = true;
                        for (var i = 0; i < e.data.length; i++) {
                            if (e.data[i] == "") {
                                alert("请完善地址信息");
                                flag = false;
                                break;
                            }
                        }
                        if (flag) {
                            var params = "shopName=" + e.data[0] + "&realName=" + e.data[1] + "&phone=" + e.data[2] + "&province="+e.data[3]+"&city=" + e.data[4] + "&street=" + e.data[5];
                            if(hiddenid.val() == ""|| hiddenid.val() == undefined){
                                params = params+"&id="+"";
                            }else{
                                params = params+"&id="+hiddenid.val();
                            }
                                var url = "{:U('Cart/addAddr')}";
                                $.ajax({
                                    method: 'post',
                                    url: url,
                                    data: params,
                                    success: function (json) {
                                        hiddenid.val("");
                                        window.location.reload();
                                    }
                                })

                        }
                    },
                    onCancel: function (e) {
                        hiddenid.val("");
                        $("#shopName").val("");
                        $("#realName").val("");
                        $("#phone").val("");
                        $("#street").val("");
                        $("#city").val("扬州市");
                        $("#hidden_id").val("");
                        $("#addr_btn").html("提交");
                    }
                });
            });
        });
        //库存验证
        var changenum = function (o) {
            var num = $(o).val();
            var reg = /^\+?[1-9]\d{0,4}$/;
            if (!num.match(reg)) {
                alert("请输入正确的数量,最大购买99999份");
                window.location.reload();
                return false;
            }
            var pid = $(o).attr('dataid');
            var url = "{:U('Cart/changeNum')}";
            var params = "num=" + num + "&pid=" + pid;
            $.ajax({
                method: 'post',
                url: url,
                data: params,
                success: function (json) {
                    if (json != -1) {
                        alert("您选择的商品库存不足,仅剩" + json + "份");
                    }
                    window.location.reload();
                }
            })
        }
        //删除商品
        var delPro = function (o) {
            var pid = $(o).attr('dataid');
            var url = "{:U('Cart/delPro')}";
            var params = "pid=" + pid;
            $.ajax({
                method: 'post',
                url: url,
                data: params,
                success: function (json) {
                    window.location.reload();
                }
            })
        }
        //修改地址
        $(".addr").click(function(){
            $("#shopName").val($(this).data("shopname"));
            $("#realName").val($(this).data("name"));
            $("#phone").val($(this).data("phone"));
            $("#street").val($(this).data("street"));
            $("#city").val($(this).data("city"));
            $("#hidden_id").val($(this).data("id"));
            $("#addr_btn").html("确认修改");
            $('#doc-prompt-toggle').click();
        });
    </script>
</block>